<template>
	<view>
		<view>
		      <view class="item-war" v-for="(item, index) in addList" :key="index">
		          <view class="item-top">
		            <image class='top-img' v-bind:src="item.userinfo.avatar?item.userinfo.avatar:avatar">
		            <view class="item-conent">
		              <view class='item-tops' >{{item.userinfo.nickname}}</view>
		              <view class="bot-text">{{item.content}}</view>
		            </view>
		          </view>
				  <view v-if="item.status==1" class="zhuangtai">
					  <button class="cu-btn" @click.stop="agreed(item.id)">通过</button>
					  <button class="cu-btn cu-btn1" @click.stop="jujue(item.id)">拒绝</button>
				  </view>
				  <block v-else-if="item.status==2">
					  <view class="mybuts">
					    已通过
					  </view>
				  </block>
				  <block v-else-if="item.status==3">
				  		<view class="mybuts">
				  		  已拒绝
				  		</view>			  
				  </block>
		      </view>
		    </view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				addList : [],
				phone:'',
				group_id : ''
			}
		},
		onLoad(option){
			this.group_id = option.group_id
			// this.initDat();
			// uni.onSocketMessage(function (res) {
			//   console.log('收到服务器内容：' + res.data);
			// });
		},
		onShow(){
			this.$msgchat.initwork();
			this.initDat();
		},
		methods: {
			initDat(){
				var obj = {
					qid : this.group_id
				}
				this.$common.requests('/api/group/getjinqunlist', obj).then(res => {
					// console.log(res)
					for(var i=0;i < res.data.data.length;i++ ){
						// this.avatar = res.data.data[i].userinfo.avatar;
						if(res.data.data[i].userinfo.avatar){
							res.data.data[i].userinfo.avatar =  this.$common.baseUrl + res.data.data[i].userinfo.avatar;
						}else{
							res.data.data[i].userinfo.avatar = '';
						}
						
					}
					this.addList = res.data.data;
				})
			},
			//同意
			agreed(ids){
				this.$common.requests('/api/group/agreejinqu', {sid: ids}).then((res)=>{
					if(res.data.code == 1){
						this.$api.msg(res.data.msg);
						this.initDat();
					}
				})
			},
			jujue(ids){
				this.$common.requests('/api/group/nojinqu', {sid: ids}).then((res)=>{
					if(res.data.code == 1){
						this.$api.msg(res.data.msg);
						this.initDat();
					}
				})
			},
		}
	}
</script>

<style lang="scss">
	 page{
		 height: 100%;
		 background: $uni-color-bei;
		 border-top: 1px solid #ebeced;
	 }
	 .cu-btn{
		 margin-right: 3%;
		 background: #F4F6FF;
		 color: $uni-bt-color;
		 width: 132upx;
	 }
        .item-war{
          width: 100%;
          display: flex;
          justify-content: space-between;
          align-items: center;
          padding: 0.5rem 0 0.5rem 1rem;
          /*margin-top: 0.7rem;*/
          background: #fff;
          border-bottom: 1px solid #ebeced;
        }
        .item-top{
          width: 100%;
          display: flex;
          justify-content: flex-start;
          align-items: center;
        }
        .item-tops{
          color: #333;
          font-weight: bold;
          font-size: 18px;
        }
        .item-conent{
          margin-left: 0.7rem;
          height: 2.6rem;
          display: flex;
          flex-direction: column;
          justify-content: space-between;
        }
        .top-img{
          width: 3rem;
		  height: 3rem;
          border-radius: 50%;
        }
        .bot-text{
          color: #898989;
          font-size: 16px;
        }
        .mybut{
          width: 3rem;
		  height: 3rem;
          background: #F4F6FF;
          color: #03A9F4;
          margin-right: 3%;
        }
        .mybuts{
          color: #898989;
          margin-right: 3%;
          width: 132upx;
        }

		.zhuangtai{
			display: flex;
			justify-content: space-between;
			width: 45vw;
		}

		.cu-btn1{
			color: red;
		}
</style>
